.banner
  height 100%
  position relative
  overflow hidden
  cursor default
  overflow-wrap break-word

  .mask
    position absolute
    width 100%
    height 100%
    background-color rgba(0, 0, 0, 0.3)

  .page-header
    color #fff
    max-width calc(960px - 6rem)
    width 80%

  @media (max-width: 575px)
    .page-header, .page-header .iconfont
      font-size 0.9rem

  &[parallax="true"]
    will-change transform
    -webkit-transform-style preserve-3d
    -webkit-backface-visibility hidden

if $banner-width-height-ratio > 0
  @media (max-width: unit($banner-width-height-ratio * 100, "vh"))
    header
      max-height unit(100 / $banner-width-height-ratio, "vw")

    #board
      margin-top -1rem !important

  @media (max-width: unit($scroll-arrow-height-limit - 0.01, "vh"))
    .scroll-down-bar
      display none
